/* Banner */
.banner { position: relative;}
.banner .stage { position: relative;}
.banner .bxslider li img { width: 100%; height: auto;}
.banner .bxslider li a, .banner .bxslider li a:hover { color: #fff; text-decoration: none;}
.banner .bxslider li .caption { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.banner .bxslider li .container { height: 100%; position: relative;}
.banner .bxslider li .caption .overlay { position: absolute;  display: block; width: 38.49%; padding: 15px; background: url(../img/red_bg.png) repeat 0 0; color: #fff;}
.banner .bxslider li .caption.top-left .overlay { top: 73px; left: 104px;}
.banner .bxslider li .caption.top-right .overlay { top: 73px; right: 104px;}
.banner .bxslider li .caption.center-left .overlay { top: 50%; left: 104px; margin-top: -70px;}
.banner .bxslider li .caption.center-right .overlay { top: 50%; right: 104px; margin-top: -70px;}
.banner .bxslider li .caption.bottom-left .overlay { bottom: 93px; left: 104px;}
.banner .bxslider li .caption.bottom-right .overlay { bottom: 93px; right: 104px;}
.banner .bxslider li .caption h4 { margin-bottom: 5px; font-size: 24px; color: #fff; line-height: 1.2;}
.banner .bxslider li .caption p { margin-bottom: 5px; font-size: 18px; color: #fff; line-height: 1.2;}
.banner .bxslider li .caption .link-more { display: block; padding-left: 15px; background-position: -88px -304px; font-size: 16px; color: #fff; }
.banner .bxslider li .caption .overlay:hover .link-more { text-decoration: underline;}
.banner .bx-controls .bx-pager {position: absolute;bottom: 61px;left: 0;width: 100%;height: 10px;text-align: center;z-index: 2;}
.banner .bx-controls .bx-pager .bx-pager-item {display: inline-block;width: 10px;height: 10px;margin: 0 5px;}
.banner .bx-controls .bx-pager .bx-pager-item a { display: block; width: 10px; height: 10px; background: #fff; text-indent: -9999px;}
.banner .bx-controls .bx-pager .bx-pager-item a.active { display: block; width: 10px; height: 10px; background: #e31937;}
.banner .bx-controls .bx-controls-direction { position: absolute; top: 50%; left: 0; width: 100%; height: 41px; margin-top: -21px; z-index: 1;}
.banner .bx-controls .bx-controls-direction .container { height: 100%; position: relative;}
.banner .bx-controls .bx-prev, .banner .bx-controls .bx-next { position: absolute; top: 50%; display: block; width: 26px; height: 41px; margin-top: -20px; text-indent: -9999px; -webkit-transform: scale(0.57);-moz-transform: scale(0.57); transform: scale(0.57); -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s;}
.banner .bx-controls .bx-prev { left: 15px; background-position: 0 -382px;}
.banner .bx-controls .bx-next { right: 15px; background-position: -26px -382px;}
.banner .bx-controls .bx-prev:hover, .banner .bx-controls .bx-next:hover { -webkit-transform: scale(1);-moz-transform: scale(1); transform: scale(1);}

.banner .icon-boxs { position: relative; z-index: 5; margin-top: -42px;}
.banner .icon-boxs ul li { float: left; width: 20%;  border-right: solid 1px #8b8d8e; text-align: center; display: table; overflow: hidden; position: relative; background-color: #fff; height: 85px; vertical-align: middle;}
.banner .icon-boxs ul li:last-child { border-right: 0 none;}
.banner .icon-boxs ul li a { display: table-cell; padding:0; vertical-align: middle; color: #8b8d8e;height: 85px; overflow: hidden; }
.banner .icon-boxs ul li a:hover { text-decoration: none;}
.banner .icon-boxs ul li img { margin-right: 5px; vertical-align: middle; }
.banner .icon-boxs ul li p { display: inline-block; max-width: 100px; margin-left: 5px; font-size: 18px; color: #8b8d8e; line-height: 1; text-align: left; vertical-align: middle;}
.banner .icon-boxs ul li:last-child p { max-width: 116px;}
.banner .icon-boxs .btn-scroll-down { position: absolute; bottom: 10px; left: 50%; display: block; width: 36px; height: 23px; margin-left: -18px; background-position: 0 -136px;}


.banner .bxslider li .caption .link-more,.red-btn span { background: url(../img/arrow_white_2x.png) no-repeat 0 2px; background-size: 10px auto;}


.bx-wrapper {
    box-shadow: none;
    border: 0px;
}

.main {
    background: #f6f6f6;
}

.nav-main {
    height: 80px;
    background: #060606;
    opacity: 20%;
}

.nav-logo {
    line-height:80px;
    width: 150px;
    margin-left: 40px;
    background: none;
    font-size:20px;
    color: white;
}
.nav {
    line-height:80px;
    background: #060606;
}

li {
    list-style:none;
}

.nav ul li{
    line-height: 60px;
    height:auto;
    display: inline;
}

.nav ul li a {
    padding: 0 10px;
    cursor: pointer;
    color: white;
}

.nav ul li a:hover {
    background: #e31937;
}

.nav ul li.active a {
    background: #e31937;
}

.nav ul li.active a, .nav ul li a:hover {
    text-decoration: none;
}


/* service-list  */
.service-list { clear: both; overflow: hidden; margin-bottom: 40px;}
.service-list h2 {
    font-family: MetaWebPro-Bold, sans-serif;
    font-size: 28px;
    line-height: 1;
    padding: 17px 0 34px;
}
.service-list ul { margin-left: -1.9%;}
.service-list li {
    float: left;
    width: 23.1%;
    margin-left: 1.9%;
    position: relative;
    margin-bottom: 20px;
}
.service-list li a {
    display: block;
    overflow: hidden;
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
}
.service-list li a:hover {
    -moz-box-shadow:2px 2px #ccc;
    -webkit-box-shadow:2px 2px #ccc;
    box-shadow: 2px 2px #ccc;
}
.service-list li a img {
    display: block; width: 100%;
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
}
.service-list li a:hover img {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
}
.service-list p {
    width: 100%;
    position: absolute;
    left: 0; bottom: 0;
    height: auto;
    line-height: 1.15;
    font-family: MetaWebPro-Bold, sans-serif;
    padding: 15px 0px;
    text-align: center;
    background: #fff;
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    font-size: 18px;
    color: #666;
}
.service-list a:hover p{ background-color: #e2e2e2; text-decoration: none;}


/* guarantee-list  */
.guarantee-list { clear: both; overflow: hidden; margin-bottom: 40px;}
.guarantee-list h2 {
    font-family: MetaWebPro-Bold, sans-serif;
    font-size: 28px;
    line-height: 1;
    padding: 17px 0 34px;
    text-align: center;
}
.guarantee-list ul { margin-left: -3%;}
.guarantee-list li {
    text-align: center;
    float: left;
    width: 30%;
    margin-left: 3%;
    position: relative;
    margin-bottom: 60px;
}

.guarantee-list li a {
    display: block;
    overflow: hidden;
    border: solid 1px gray;
    padding: 20px;
}

.guarantee-list li a:hover {
    border: solid 1px gray;
}

.guarantee-list .title {
    margin-bottom: 20px;
}




.footer {
    height: 60px;
    line-height:60px;
    background: #060606;
    color: white;
    text-align: center;
}

/* responsive */
@media screen and (min-width: 1200px) {
    .container {
        width: 1090px;
    }
}

@media screen and (min-width: 992px) and (max-width:1200px){
    .container {
        width: 898px;
    }
}

@media screen and (min-width: 768px) and (max-width:992px) {
    .container {
        width: 684px;
    }
}

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 1090px;
    min-width: 320px;
}


/* common */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, details, figure, figcaption, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

.pull-right {
    float: right!important;
}

.pull-left {
    float: left!important;
}

.center {
    text-align: center;
}

.clear {
    clear: both;
}
